<template>
  <view class="card"  :class="{'border':border}">
    <view v-for="i of 3" :key="i" class="border-b p-c-15">
      <view class="flex-between u-f-sm" v-if="oper">
        <view>
          订单号：O202509121532041554
        </view>
        <view class="f-c-9">待付款</view>
      </view>
      <view class="p-c-15 flex">
        <up-image shape="square" radius="12rpx" :show-loading="true"
                  src="https://picsum.photos/200/300" width="130rpx"
                  height="130rpx" style="margin-right: 20rpx"></up-image>
        <view class="u-f-sl" @click="toPath('/shop/index/detail?id=12')">
          <view class="text-2">
            阿斯顿发斯蒂芬阿斯顿发生大法师打发斯蒂芬阿斯蒂芬阿斯蒂芬阿是发大水地方啊沙发斯蒂芬阿斯蒂芬阿斯顿发生啊水电费阿斯蒂芬暗室逢灯阿斯蒂芬
          </view>
          <view class="u-f-sm f-c-9 p-c-15">
            红色
          </view>
          <view class="u-f-sl flex-between">
            <view>￥ 240.00 × 1</view>
            <slot name="after"></slot>
          </view>
        </view>
      </view>
    </view>
    <view style="margin-top: 20rpx"  v-if="oper">
      <view class="text-r u-f-sm">共 1 件商品 合计：￥ 240.00</view>
      <view class="flex-end" style="margin-top: 10rpx">
        <a-button shape="circle" @click="console.log('222')" type="info">取消订单</a-button>
        <a-button shape="circle" type="info" style="margin-left: 10rpx"
                  @click="toPath(`/order/detail?id=12`)">查看详情
        </a-button>
        <a-button shape="circle" @click="console.log('222')" type="info" style="margin-left: 10rpx" v-if="false">评价
        </a-button>
        <a-button shape="circle" @click="console.log('222')" type="primary" style="margin-left: 10rpx"
                  color="linear-gradient(-60deg, #ff5858 0%, #f09819 100%)">继续支付
        </a-button>
        <a-button shape="circle" @click="console.log('222')" type="primary" style="margin-left: 10rpx"
                  color="linear-gradient(-60deg, #ff5858 0%, #f09819 100%)">确定收货
        </a-button>
      </view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import {toPath} from "@/util/router/router";

const props = defineProps({
  oper:{
    type:Boolean,
    default:true
  },
  border:{
    type:Boolean,
    default:false
  }
})
</script>

<style scoped lang="scss">
@import "@/static/css/index.css";

.border{
  border: 1rpx solid #999;
}


</style>